﻿@model IEnumerable<NCLCustomerManagement.UI.Models.ProductCategory.ProductCategoryModel>
@{
    Layout = "";
    ViewBag.Title = "ProductCategory";
}

<div id="changePasswordMsgbox" class="alert alert-danger" style="display: none;">

    <div class="msg-content"></div>

</div>


<div class="area">
    <div class="row">

        <div class="col-xs-7">
            <input id="txtCategory" type="text" class="form-control input-sm" placeholder="Tạo nhóm sản phẩm mới">
        </div>
        <div class="col-xs-5" style="padding-left: 0px;">
            <div class="btn-toolbar">
                <button id="btnNewCategory" class="btn btn-primary btn-sm" onclick="newCategory();"><span class="glyphicon glyphicon-plus" title="Thêm"></span></button>
                <button id="btnDeleteCategory" class="btn btn-danger btn-sm" onclick="deleteCategory();" disabled="disabled"><span class="glyphicon glyphicon-remove" title="Xóa"></span></button>
                <button id="btnUpdateCategory" onclick="updateCategory();" type="button" class="btn btn-default btn-sm" disabled="disabled"><span class="glyphicon glyphicon-edit" title="Sửa"></span></button>
            </div>
        </div>
    </div>
</div>


<div class="form-group" id="categoryList">
    @Html.Partial("_CategoryListPartial", Model as object)
</div>
<div class="btn-toolbar">
    <div class="bt-n-group" style="float: right;">

        <button id="btnCancel" class="btn btn-default btn-sm" onclick="cancel();"><span class="glyphicon glyphicon-log-out" title="Đóng">Đóng</span></button>
    </div>
</div>

<div id="dialog-del-category" title="Xác nhận" style="display: none;">
    <p>
        <span class="ui-icon ui-icon-alert" style="float: left; margin: 0 7px 20px 0;"></span>
        Bạn có chắc muốn xóa những nhóm sản phẩm đã chọn?
    </p>
</div>

<script>
    function newCategory() {

        $.blockUI();
        //var d = JSON.stringify(model);
        $.ajax({
            url: "/Customer/SubmitNewCategory/" + $("#txtCategory").val(),
            data: {},
            contentType: 'json',
            dataType: "json",
            type: "get",
            success: function (data) {
                showMessage("#changePasswordMsgbox", data.Message, !data.Success);

                if (data.Success) {
                    loadCategoryList(function () {
                        $("#ProductCategories").change(function () {
                            handleCategoryPageControls();
                        });
                    });
                    $("#btnDeleteCategory").attr("disabled", "true");
                    $("#btnUpdateCategory").attr("disabled", "true");
                }
                $.unblockUI();
            },
            error: function (data) {
                //window.location.href = "/User/Login";
                $.unblockUI();
            }
        });


        function getChangePasswordModel() {
            return {
                currentPassword: $("#CurrentPassword").val(),
                newPassword: $("#NewPassword").val(),
            };
        }
    }
    function deleteCategory() {
        var ids = [];
        var items = getSelectedCategories();
        $(items).each(function () {
            ids.push(this.id);
        });


        $("#dialog-del-category").dialog({
            resizable: false,
            height: 160,
            modal: true,
            buttons: {
                "Xóa đi": function () {
                    startDeleteCategory();
                    $(this).dialog("close");
                },
                "Khoan đã": function () {
                    $(this).dialog("close");
                }
            }
        });
        function startDeleteCategory() {
            $.blockUI();
            $.ajax({
                url: "/Customer/SubmitDeleteCategory",
                data: JSON.stringify({ ids: ids }),
                contentType: 'application/json',
                dataType: "json",
                type: "POST",
                success: function (data) {
                    $.unblockUI();
                    showMessage("#changePasswordMsgbox", data.Message, !data.Success);
                    if (data.Success) {
                        loadCategoryList(function () {
                            $("#ProductCategories").change(function () {
                                handleCategoryPageControls();
                            });
                        });
                    }
                },
                error: function (err) {
                    $.unblockUI();
                    //showMessage("#alertbox", "Không thể xóa khách hàng!", true);
                }
            });
        }
    }

    function updateCategory() {
        var item = getSelectedCategories()[0];
        $.blockUI();
        $.ajax({
            url: "/Customer/SubmitUpdateCategory",
            data: JSON.stringify({ id: item.id, name: $("#txtCategory").val() }),
            contentType: 'application/json',
            dataType: "json",
            type: "POST",
            success: function (data) {
                $.unblockUI();
                showMessage("#changePasswordMsgbox", data.Message, !data.Success);
                if (data.Success) {
                    loadCategoryList(function () {
                        $("#ProductCategories").change(function () {
                            handleCategoryPageControls();
                        });
                    });
                    $("#btnDeleteCategory").attr("disabled", "true");
                    $("#btnUpdateCategory").attr("disabled", "true");
                }
            },
            error: function (err) {
                $.unblockUI();
                //showMessage("#alertbox", "Không thể xóa khách hàng!", true);
            }
        });
    }

    function loadCategoryList(callback) {
        $.ajax({
            url: "/Customer/GetCategoryListPartial",
            data: {},
            contentType: 'text/html',
            dataType: "html",
            type: "get",
            asyn: false,
            success: function (data) {
                $("#categoryList").html(data);
                callback();
            }
        });
    }

    function cancel() {
        $('#changePasswordWindow').modal('hide');
    }

    $(document).ready(function () {
        $("#ProductCategories").change(function () {
            handleCategoryPageControls();

        });
    });

    function handleCategoryPageControls() {
        var selectedCates = getSelectedCategories();

        if (selectedCates.length == 1) {
            $("#btnUpdateCategory").removeAttr("disabled");
        }
        else {
            $("#btnUpdateCategory").attr("disabled", "true");
        }

        if (selectedCates.length > 0) {
            $("#btnDeleteCategory").removeAttr("disabled");
        }
        else {
            $("#btnDeleteCategory").attr("disabled", "true");
        }
        if (selectedCates.length > 0) {
            $("#txtCategory").val(selectedCates[0].productCategoryName);
        }
    }

    function getSelectedCategories() {
        var items = $("#ProductCategories option:selected");
        var list = [];
        $(items).each(function () {
            list.push({ id: $(this).val(), productCategoryName: $(this).text() });
        });
        return list;
    }
</script>

